<!--
 * @Author: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
 * @Date: 2024-05-06 11:23:18
 * @LastEditors: icymoon911 icymoon911@163.com
 * @LastEditTime: 2024-07-23 04:29:38
 * @FilePath: \ken147258.topayClient\src\views\other\system\basic-setting.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="app-container">
    <div class="search-container">
      <FormList :initForm="initSearchForm" v-model:formModel="searchForm"></FormList>
    </div>
    <el-card shadow="never" class="table-container">
      <template #header>
        <el-button type="success" @click="handleTableBtnClick({}, 'add')"
          ><i-ep-plus />添加</el-button
        >
        <!-- <el-button type="primary" @click="handleTableBtnClick({}, 'remove-tg-all')"
          ><i-ep-remove />一键解綁TG</el-button
        > -->
        <!-- <el-button type="warning" @click="handleTableBtnClick({}, 'groud-send')"
          ><i-ep-promotion />一键群发</el-button
        >
        <el-button type="danger" @click="handleTableBtnClick({}, 'unbind-all')"
          ><i-ep-close-bold />一键解綁TG</el-button
        > -->
      </template>
      <comTable
        :data="tableDatasCom"
        :config="tableconfig"
        :tableHeader="tableHeader"
        v-loading="loading"
        @link-click="handleTableBtnClick"
      >
        <template #usable_amount="{ row, index }">
          <div flex justify-center items-center>
            <span>{{ row.usable_amount }}</span>
            <el-divider direction="vertical" />
            <el-button type="primary" size="small" h-22px line-height-22px pl-5px pr-5px @click="handleTableBtnClick(row, 'zengjianyue')">
              增减
            </el-button>
          </div>
        </template>
        <!-- <template #display="{ row, index }">
          <el-switch prop="display" v-model="row.delivery" />
        </template> -->
        <template #status="{ row, index }">
          <el-switch
            v-model="row.statusCom"
            inline-prompt
            @change="(val) => handleChangeStatus(val, row, index, 'status')"
          />
        </template>
        <template #allow_df="{ row, index }">
          <el-switch
            v-model="row.allow_dfCom"
            inline-prompt
            @change="(val) => handleChangeStatus(val, row, index, 'allow_df')"
          />
        </template>
      </comTable>

      <pagination
        v-if="tableDatasObj.paging.total > 0"
        v-model:total="tableDatasObj.paging.total"
        v-model:page="tableDatasObj.paging.page"
        v-model:limit="tableDatasObj.paging.limit"
        @pagination="handleQuery"
      />
    </el-card>
    <!-- 弹窗 -->
    <el-dialog
      v-model="dialog.visible"
      :title="dialog.title"
      :width="dialog.width"
      append-to-body
      @close="closeDialog"
      @closed="closedDialog"
    >
      <FormList
        v-if="initDialogForm.initKeys.length"
        v-model:formRef="formDialogId"
        v-model:formModel="formDialogModel"
        :initForm="initDialogForm"
      ></FormList>
      <!-- 弹窗底部操作按钮 -->
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="handleLeftClick">{{
            dialog.leftBtnText
          }}</el-button>
          <el-button @click="handleRightClick">{{ dialog.rightBtnText }}</el-button>
        </div>
      </template>
    </el-dialog>
    <el-dialog
      v-model="dialogForPayOnOff.visible"
      :title="dialogForPayOnOff.title"
      :width="dialogForPayOnOff.width"
      append-to-body
      @close="dialogForPayOnOff.closeDialog"
    >
      <ChannelsChange
        v-if="dialogForPayOnOff.visible"
        :id="dialogForPayOnOff.id"
        :type="dialogForPayOnOff.type"
      />
      <!-- 弹窗底部操作按钮 -->
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="dialogForPayOnOff.handleRightClick">{{
            dialogForPayOnOff.rightBtnText
          }}</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">
import { inject } from "vue";
import { useRoute } from "vue-router";
import { FormInstance } from "element-plus";
import FormList from "@/components/FormList/index.vue";
import comTable from "@/components/comTable/comTable.vue";
import {
  list,
  add,
  secret_key_reset,
  edit,
  del,
  amount_change,
  login_clear,
  google_clear,
  tg_bind,
  tg_clear,
  tg_clear_all,
} from "@/api/other/merchant";
import { cloneDeep } from "lodash";

const getFormatDate = inject("getFormatDate");
const switchFieldHandle = inject("switchFieldHandle");
const route = useRoute();

const options = {
  handle_type: [
    {
      label: "减少",
      value: "1",
    },
    {
      label: "增加",
      value: "2",
    },
  ],
  capital_type: [
    {
      label: "可用余额",
      value: "1",
    },
    {
      label: "冻结余额",
      value: "2",
    },
  ],
  reason: [
    {
      label: "充值上分",
      value: "1",
    },
    {
      label: "调整余额",
      value: "2",
    },
    {
      label: "冲正",
      value: "3",
    },
    {
      label: "补单",
      value: "4",
    },
  ],
  status: [
    {
      label: true,
      value: "1",
    },
    {
      label: false,
      value: "2",
    },
  ],
  allow_df: [
    {
      label: true,
      value: "1",
    },
    {
      label: false,
      value: "2",
    },
  ],
  mer_type: [
    {
      label: "下单商户",
      value: "1",
    },
    {
      label: "代付商户",
      value: "2",
    },
  ],
};

const searchForm = ref({});
const initSearchForm = ref({
  // 表单标签位置
  // labelPosition: "right",
  formAttrs: {
    // 是否内联
    inline: true,
  },
  rowAttrs: {
    // 行内表单数量
    columnsNum: 4,
  },
  // 初始化表单字段
  initKeys: [
    {
      // 类型
      type: "input",
      // 唯一标识
      key: "id",
      // 表单属性
      formAttrs: {
        label: "商户ID",
      },
      // 控制属性
      controlAttrs: {
        // 提示文本
        placeholder: "请输入商户UID",
        // 是否可清空
        clearable: true,
      },
      // 控制事件
      controlOn: {},
    },
    {
      // 类型
      type: "input",
      // 唯一标识
      key: "mer_name",
      // 表单属性
      formAttrs: {
        label: "商户名称",
      },
      // 控制属性
      controlAttrs: {
        // 提示文本
        placeholder: "请输入商户名称",
        // 是否可清空
        clearable: true,
      },
      // 控制事件
      controlOn: {},
    },
    // {
    //   type: "select",
    //   // 唯一标识
    //   key: "mer_type",
    //   // 表单属性
    //   formAttrs: {
    //     label: "商户类型",
    //   },
    //   // 控制属性
    //   controlAttrs: {
    //     // 提示文本
    //     placeholder: "请选择商户类型",
    //     // 是否可清空
    //     // clearable: true,
    //     style: {
    //       width: "100%",
    //     },
    //   },
    //   value: "1",
    //   options: options.mer_type,
    // },
    // {
    //   // 类型
    //   type: "range-inputs",
    //   // 唯一标识
    //   key: "min_amount_max_amount",
    //   // 表单属性
    //   formAttrs: {
    //     label: "金额范围",
    //   },
    //   // 控制属性
    //   controlAttrs: {
    //     value: [null, null],
    //     attrs: [
    //       {
    //         // 提示文本
    //         placeholder: "请输入最小值",
    //         // 是否可清空
    //         clearable: true,
    //         controlsPosition: "right",
    //         min: 0,
    //       },
    //       {
    //         // 提示文本
    //         placeholder: "请输入最大值",
    //         // 是否可清空
    //         clearable: true,
    //         controlsPosition: "right",
    //         min: 0,
    //       },
    //     ],
    //   },
    //   // 控制事件
    //   // controlOn: {},
    // },
    {
      // 类型
      type: "buttons",
      // 按钮
      btns: [
        {
          // 文本
          text: "搜索",
          // 控制属性
          controlAttrs: {
            // 类型
            type: "primary",
            icon: "search",
          },
          // 控制事件
          controlOn: {
            // 点击
            click: (e: Event, formRef: FormInstance, data: Array<object>) => {
              formRef.validate((valid) => {
                if (valid) {
                  console.log("fields", data);
                  tableDatasObj.value.paging.page = 1;

                  let tempData = { ...data };

                  if (data.start_time) {
                    tempData.start_time = data.start_time.getTime() / 1000;
                  }
                  if (data.end_time) {
                    tempData.end_time = data.end_time.getTime() / 1000;
                  }

                  // tempData.min_amount = data.min_amount_max_amount[0];
                  // tempData.max_amount = data.min_amount_max_amount[1];

                  // delete tempData.min_amount_max_amount;

                  tableDatasObj.value.queryParams = tempData;

                  handleQuery(tableDatasObj.value.paging);
                }
              });
            },
          },
        },
        {
          // 文本
          text: "重置",
          // 控制属性
          controlAttrs: {
            icon: "refresh",
          },
          // 控制事件
          controlOn: {
            // 点击
            click: resetQuery,
          },
        },
      ],
    },
  ],
});

/** 重置查询 */
function resetQuery(e: Event, formRef: FormInstance, data: Array<object>) {
  // 重置表单
  formRef.resetFields();
  // 查询
  tableDatasObj.value.paging.page = 1;
  tableDatasObj.value.paging.limit = 20;
  tableDatasObj.value.queryParams = { ...searchForm.value };
  const params = {
    ...tableDatasObj.value.queryParams,
    ...data,
    ...tableDatasObj.value.paging,
  };

  handleQuery(params);
}

// 表*********************************************
const loading = ref(false);

const tableDatasObj = ref({
  list: [],
  paging: {
    limit: 20,
    page: 1,
    total: 0,
  },
});
const tableDatasCom = computed(() => {
  return tableDatasObj.value.list.map((item) => {
    return {
      ...item,
      // status_com: item.status + "" === "1" ? "正常" : "禁用",
      createtimeCom: item.createtime ? getFormatDate(item.createtime) : "-",
      statusCom: options.status.find(
        (tItem) => tItem.value.toString() === item.status.toString()
      )?.label,
      allow_dfCom: options.allow_df.find(
        (tItem) => tItem.value.toString() === item.allow_df.toString()
      )?.label,
      mer_typeCom: options.mer_type.find(
        (tItem) => tItem.value.toString() === item.mer_type.toString()
      )?.label,
    };
  });
});
const tableconfig = {
  // tableHeight: 480, //表格高度
  isSelection: false, //显示复选框
  isRowClick: false, //使用行点击
  isStripe: true, //隐藏斑马纹，与背景色不可同时用
  isShowSummary: false, //显示共计
  isIndex: true, //自定义序号
  isNeedPagination: true, //是否需要分页
};
const tableHeader = [
  { label: "商户ID", prop: "id", width: 100 },
  { label: "商户密钥", prop: "secret_key", width: 280 },
  { label: "商户名称", prop: "mer_name", minWidth: 200 },
  // { label: "商户类型", prop: "mer_typeCom", minWidth: 200 },
  { label: "可用余额", prop: "usable_amount", width: 150, type: "slot" },
  { label: "冻结余额", prop: "frozen_amount", width: 150 },
  { label: "状态", prop: "status", type: "slot" },
  { label: "代付", prop: "allow_df", type: "slot" },
  // { label: "最小金额", prop: "min_amount", width: 120 },
  // { label: "最大金额", prop: "max_amount", width: 120 },
  { label: "注册时间", prop: "createtimeCom", width: 200 },
  {
    label: "操作",
    isSort: false,
    prop: "operation",
    columnAttrs: {
      fixed: "right",
      width: "400",
    },
    children: [
      {
        type: "button",
        btnText: "清登录",
        title: "clear-login",
      },
      {
        type: "button",
        btnText: "清谷歌",
        title: "clear-google",
      },
      {
        type: "button",
        btnText: "重置密钥",
        title: "reset",
      },
      {
        type: "button",
        btnText: "通道费率",
        title: "pay-on-off",
      },
      // {
      //   type: "button",
      //   btnText: "费率",
      //   title: "rate",
      // },
      // {
      //   type: "button",
      //   btnText: "代付费率",
      //   title: "agency-rate",
      // },
      // {
      //   type: "button",
      //   btnText: "TG",
      //   title: "tg",
      // },
      // {
      //   type: "button",
      //   btnText: "解绑TG",
      //   title: "unbind-tg",
      // },
      {
        type: "button",
        btnText: "编辑",
        title: "edit",
      },
      // {
      //   type: "button",
      //   btnText: "TG",
      //   title: "tg",
      // },
      {
        type: "button",
        btnText: "删除",
        title: "del",
      },
    ],
  },
];

/**
 * 查询
 */
function handleQuery(paging: { page: number; limit: number }) {
  loading.value = true;
  list({
    ...tableDatasObj.value.paging,
    ...tableDatasObj.value.queryParams,
    mer_type: route.meta.mer_type,
  })
    .then((res) => {
      tableDatasObj.value.list = res.list;
      tableDatasObj.value.paging.total = res.total;
    })
    .finally(() => {
      loading.value = false;
    });
  // if (tableDatasObj.paging.typeCode) {
  // loading.value = true;
  // getDictPage(queryParams)
  //   .then(({ data }) => {
  //     dictList.value = data.list;
  //     total.value = data.total;
  //   })
  //   .finally(() => (loading.value = false));
  // }
}
// 完*********************************************

const initDialogForm = ref({
  // 表单标签位置
  formAttrs: {
    // 是否内联
    // inline: true,
    labelPosition: "top",
  },
  rowAttrs: {
    // 行内表单数量
    columnsNum: 2,
  },
  // 初始化表单字段
  initKeys: <any>[],
});

let initDialogFormBak = cloneDeep(initDialogForm.value);

const isHasOptions = [
  {
    // 标签
    label: "关闭",
    // 值
    value: 0,
  },
  {
    // 标签
    label: "开启",
    // 值
    value: 1,
  },
];

const switchFieldArr = [
  "allow_df",
  "status",
  "is_check",
  "hide_withdrawa",
  "audit_withdrawal_user",
  "allow_fore_launch_df",
  "google_check",
  "support_back",
];

function handleTableBtnClick(row: object, title: string) {
  dialog.type = title;
  dialog.singleData = tableDatasObj.value.list.find((item) => item.id === row.id);

  if (title === "add") {
    dialog.visible = true;
    dialog.title = "添加用户";
    dialog.leftBtnText = "确 定";
    dialog.rightBtnText = "取 消";
    dialog.width = 400;

    initDialogForm.value.rowAttrs.columnsNum = 1;
    initDialogForm.value.initKeys = [
      {
        // 类型
        type: "input",
        // 唯一标识
        key: "mer_name",
        // 表单属性
        formAttrs: {
          label: "商户户名",
        },
        // 控制属性
        controlAttrs: {
          // 提示文本
          placeholder: "请输入商户户名",
          // 是否可清空
          clearable: true,
        },
        // 控制事件
        controlOn: {},
      },
      // {
      //   // 类型
      //   type: "input",
      //   // 唯一标识
      //   key: "nick_name",
      //   // 表单属性
      //   formAttrs: {
      //     label: "昵称",
      //   },
      //   // 控制属性
      //   controlAttrs: {
      //     // 提示文本
      //     placeholder: "请输入昵称",
      //     // 是否可清空
      //     clearable: true,
      //   },
      //   // 控制事件
      //   controlOn: {},
      // },
      {
        // 类型
        type: "input",
        // 唯一标识
        key: "password",
        // 表单属性
        formAttrs: {
          label: "密码",
        },
        // 控制属性
        controlAttrs: {
          // 提示文本
          placeholder: "请输入密码（6-12位）",
          // 是否可清空
          clearable: true,
          maxlength: 12,
        },
        // 控制事件
        controlOn: {},
      },
      // {
      //   type: "select",
      //   // 唯一标识
      //   key: "mer_type",
      //   // 表单属性
      //   formAttrs: {
      //     label: "商户类型",
      //   },
      //   // 控制属性
      //   controlAttrs: {
      //     // 提示文本
      //     placeholder: "请选择商户类型",
      //     // 是否可清空
      //     // clearable: true,
      //     style: {
      //       width: "100%",
      //     },
      //   },
      //   value: "1",
      //   options: options.mer_type,
      // },
      // {
      //   // 类型
      //   type: "input",
      //   // 唯一标识
      //   key: "confirm_password",
      //   // 表单属性
      //   formAttrs: {
      //     label: "确认密码",
      //   },
      //   // 控制属性
      //   controlAttrs: {
      //     // 提示文本
      //     placeholder: "请输入确认密码（6-12位）",
      //     // 是否可清空
      //     clearable: true,
      //     maxlength: 12,
      //   },
      //   // 控制事件
      //   controlOn: {},
      // },
      // {
      //   // 类型
      //   type: "input",
      //   // 唯一标识
      //   key: "type",
      //   // 表单属性
      //   formAttrs: {
      //     label: "商户类型",
      //   },
      //   // 控制属性
      //   controlAttrs: {
      //     // 提示文本
      //     placeholder: "请选择商户类型",
      //     // 是否可清空
      //     clearable: true,
      //   },
      //   // 选项
      //   options: [
      //     {
      //       label: "普通商户",
      //       value: 1,
      //     },
      //     {
      //       label: "代理商户",
      //       value: 2,
      //     },
      //   ],
      //   // 控制事件
      //   controlOn: {},
      // },
    ];
  } else if (title === "reset") {
    dialog.visible = false;

    ElMessageBox.confirm("确认重置商户密钥码？", "信息", {
      type: "warning",
    }).then(() => {
      secret_key_reset({ id: dialog.singleData.id }).then(() => {
        ElMessage.success("重置成功");
        closedDialog();
        handleQuery();
      });
    });
  } else if (title === "groud-send") {
  } else if (title === "unbind-all") {
    ElMessageBox.confirm("确认一键解绑所有商户TG？", "信息", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    }).then(() => {
      // 访问接口；刷新列表
    });
  } else if (title === "key") {
    // 新增支付产品
    dialog.title = "敏感操作，请验证安全码";
    dialog.leftBtnText = "确 定";
    dialog.rightBtnText = "取 消";

    initDialogForm.value.initKeys.push(
      ...[
        // 产品名称
        // 通道代码
        // 通道显示
        // 状态
        {
          // 类型
          type: "input",
          // 唯一标识
          key: "qqq5",
          // 表单属性
          formAttrs: {
            label: "产品名称",
          },
          // 控制属性
          controlAttrs: {
            // 提示文本
            placeholder: "请输入产品名称",
            // 是否可清空
            clearable: true,
          },
          // 控制事件
          controlOn: {},
        },
        {
          // 类型
          type: "input",
          // 唯一标识
          key: "qqq5",
          // 表单属性
          formAttrs: {
            label: "通道代码",
          },
          // 控制属性
          controlAttrs: {
            // 提示文本
            placeholder: "请输入通道代码",
            // 是否可清空
            clearable: true,
          },
          // 控制事件
          controlOn: {},
        },
        {
          // 类型
          type: "switch",
          // 唯一标识
          key: "qqq5",
          // 表单属性
          formAttrs: {
            label: "通道显示",
          },
          // 控制属性
          controlAttrs: {
            value: false,
          },
          // 控制事件
          controlOn: {},
        },
        {
          // 类型
          type: "switch",
          // 唯一标识
          key: "qqq5",
          // 表单属性
          formAttrs: {
            label: "状态",
          },
          // 控制属性
          controlAttrs: {
            value: false,
          },
          // 控制事件
          controlOn: {},
        },
      ]
    );
  } else if (title === "pay-on-off") {
    // 渠道配置
    dialog.visible = false;

    dialogForPayOnOff.visible = true;
    dialogForPayOnOff.type = "status";
    dialogForPayOnOff.id = row.id;
    dialogForPayOnOff.title = "商户支付产品";
    dialogForPayOnOff.leftBtnText = "确 定";
    dialogForPayOnOff.rightBtnText = "取 消";
  } else if (title === "rate") {
    // 调整费率
    dialog.visible = false;

    dialogForPayOnOff.visible = true;
    dialogForPayOnOff.type = "rate";
    dialogForPayOnOff.id = row.id;
    dialogForPayOnOff.title = "商户支付渠道";
    dialogForPayOnOff.leftBtnText = "确 定";
    dialogForPayOnOff.rightBtnText = "取 消";
  } else if (title === "agency-rate") {
    // 设置费率
    initDialogForm.value.rowAttrs.columnsNum = 1;
    dialog.visible = true;
    dialog.width = 400;
    dialog.title = "调整码商费率（统一按照百分比计算）";
    dialog.leftBtnText = "确 定";
    dialog.rightBtnText = "取 消";
    initDialogForm.value.initKeys.push(
      ...[
        {
          // 类型
          type: "input-number",
          // 唯一标识
          key: "df_one_fee",
          // 表单属性
          formAttrs: {
            label: "单笔手续费（元）",
          },
          // 控制属性
          controlAttrs: {
            // 提示文本
            placeholder: "请输入单笔手续费（元）",
            // 是否可清空
            clearable: true,
            min: 0,
            style: {
              width: "100%",
            },
          },
          value: dialog.singleData.df_one_fee,
          appendTxt: "%",
          // 控制事件
          controlOn: {},
        },
        {
          // 类型
          type: "input-number",
          // 唯一标识
          key: "df_rate",
          // 表单属性
          formAttrs: {
            label: "费率（1代表1%）",
          },
          // 控制属性
          controlAttrs: {
            // 提示文本
            placeholder: "请输入费率（1代表1%）",
            // 是否可清空
            clearable: true,
            min: 0,
            max: 100,
            style: {
              width: "100%",
            },
          },
          value: dialog.singleData.df_rate,
          appendTxt: "%",
          // 控制事件
          controlOn: {},
        },
      ]
    );
  } else if (title === "edit") {
    // 设置费率
    const switchFieldObj = Object.fromEntries(
      switchFieldArr.map((field) => {
        return [[field], switchFieldHandle.getDisplay(dialog.singleData[field])];
      })
    );

    dialog.visible = true;
    dialog.title = "编辑商户";
    dialog.leftBtnText = "确 定";
    dialog.rightBtnText = "取 消";
    initDialogForm.value.initKeys.push(
      ...[
        {
          // 类型
          type: "input",
          // 唯一标识
          key: "mer_name",
          // 表单属性
          formAttrs: {
            label: "商户名称",
          },
          // 控制属性
          controlAttrs: {
            // 提示文本
            placeholder: "请输入商户名称",
            // 是否可清空
            clearable: true,
            readonly: true,
          },
          value: dialog.singleData.mer_name,
          // 控制事件
          controlOn: {},
        },
        // {
        //   // 类型
        //   type: "input",
        //   // 唯一标识
        //   key: "nick_name",
        //   // 表单属性
        //   formAttrs: {
        //     label: "昵称",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入昵称",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: dialog.singleData.nick_name,
        //   // 控制事件
        //   controlOn: {},
        // },
        {
          // 类型
          type: "input",
          // 唯一标识
          key: "password",
          // 表单属性
          formAttrs: {
            label: "登录密码",
          },
          // 控制属性
          controlAttrs: {
            // 提示文本
            placeholder: "请输入登录密码",
            // 是否可清空
            clearable: true,
          },
          value: dialog.singleData.password,
          // 控制事件
          controlOn: {},
        },
        // {
        //   // 类型
        //   type: "input",
        //   // 唯一标识
        //   key: "confirm_password",
        //   // 表单属性
        //   formAttrs: {
        //     label: "确认密码",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入确认密码",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: dialog.singleData.confirm_password,
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "input",
        //   // 唯一标识
        //   key: "safety_code",
        //   // 表单属性
        //   formAttrs: {
        //     label: "安全码",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入安全码",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: dialog.singleData.safety_code,
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "switch",
        //   // 唯一标识
        //   key: "allow_df",
        //   // 表单属性
        //   formAttrs: {
        //     label: "是否允许代付",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入是否允许代付",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: switchFieldObj["allow_df"],
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "input",
        //   // 唯一标识
        //   key: "withdrawal_fee",
        //   // 表单属性
        //   formAttrs: {
        //     label: "提现手续费",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入提现手续费",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: dialog.singleData.withdrawal_fee,
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "switch",
        //   // 唯一标识
        //   key: "status",
        //   // 表单属性
        //   formAttrs: {
        //     label: "状态",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入状态",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: switchFieldObj["status"],
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "switch",
        //   // 唯一标识
        //   key: "is_check",
        //   // 表单属性
        //   formAttrs: {
        //     label: "是否审核提现账户",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入是否审核提现账户",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: switchFieldObj["is_check"],
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "input-number",
        //   // 唯一标识
        //   key: "min_amount",
        //   // 表单属性
        //   formAttrs: {
        //     label: "最小金额",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入最小金额",
        //     // 是否可清空
        //     clearable: true,
        //     style: {
        //       width: "100%",
        //     },
        //   },
        //   value: dialog.singleData.min_amount,
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "input-number",
        //   // 唯一标识
        //   key: "max_amount",
        //   // 表单属性
        //   formAttrs: {
        //     label: "最大金额",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入最大金额",
        //     // 是否可清空
        //     clearable: true,
        //     style: {
        //       width: "100%",
        //     },
        //   },
        //   value: dialog.singleData.max_amount,
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "switch",
        //   // 唯一标识
        //   key: "hide_withdrawa",
        //   // 表单属性
        //   formAttrs: {
        //     label: "是否隐藏提现",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入是否隐藏提现",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: switchFieldObj["hide_withdrawa"],
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "input",
        //   // 唯一标识
        //   key: "login_whitelist",
        //   // 表单属性
        //   formAttrs: {
        //     label: "登录IP白名单（以逗号分隔）",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入登录IP白名单（以逗号分隔）",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: dialog.singleData.login_whitelist,
        //   // 控制事件
        //   controlOn: {},
        // },
        {
          // 类型
          type: "input",
          // 唯一标识
          key: "df_whitelist",
          // 表单属性
          formAttrs: {
            label: "代付IP白名单（以逗号分隔）",
          },
          // 控制属性
          controlAttrs: {
            // 提示文本
            placeholder: "请输入代付IP白名单（以逗号分隔）",
            // 是否可清空
            clearable: true,
          },
          value: dialog.singleData.df_whitelist,
          // 控制事件
          controlOn: {},
        },
        // {
        //   // 类型
        //   type: "switch",
        //   // 唯一标识
        //   key: "audit_withdrawal_user",
        //   // 表单属性
        //   formAttrs: {
        //     label: "是否审核提现账户",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入是否审核提现账户",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: switchFieldObj["audit_withdrawal_user"],
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "switch",
        //   // 唯一标识
        //   key: "allow_fore_launch_df",
        //   // 表单属性
        //   formAttrs: {
        //     label: "是否允许前台发起代付",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入是否允许前台发起代付",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: switchFieldObj["allow_fore_launch_df"],
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "switch",
        //   // 唯一标识
        //   key: "google_check",
        //   // 表单属性
        //   formAttrs: {
        //     label: "是否需要google验证",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入是否需要google验证",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: switchFieldObj["google_check"],
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "input",
        //   // 唯一标识
        //   key: "google_keygoogle",
        //   // 表单属性
        //   formAttrs: {
        //     label: "密钥",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入密钥",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: dialog.singleData.google_keygoogle,
        //   // 控制事件
        //   controlOn: {},
        // },
        // {
        //   // 类型
        //   type: "switch",
        //   // 唯一标识
        //   key: "support_back",
        //   // 表单属性
        //   formAttrs: {
        //     label: "是否支持回调",
        //   },
        //   // 控制属性
        //   controlAttrs: {
        //     // 提示文本
        //     placeholder: "请输入是否支持回调",
        //     // 是否可清空
        //     clearable: true,
        //   },
        //   value: switchFieldObj["support_back"],
        //   // 控制事件
        //   controlOn: {},
        // },
        {
          // 类型
          type: "input-number",
          // 唯一标识
          key: "df_rate",
          // 表单属性
          formAttrs: {
            label: "代付费率（比如设置5就表示百分之五）",
          },
          // 控制属性
          controlAttrs: {
            // 提示文本
            placeholder: "请输入代付费率",
            // 是否可清空
            clearable: true,
            style: {
              width: "100%",
            },
            value: dialog.singleData.df_rate,
          },
          // 控制事件
          controlOn: {},
        },
      ]
    );

    list({
      page: 1,
      limit: 999999,
    }).then((res) => {});
  } else if (title === "del") {
    // 删除
    ElMessageBox.confirm("确定要删除吗？", "删除", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    }).then(() => {
      let params = {
        ids: [dialog.singleData].map((item) => item.id).join(","),
      };

      del(params).then((res) => {
        if (tableDatasObj.value.list.length === 1) {
          if (tableDatasObj.value.paging.page > 1) {
            --tableDatasObj.value.paging.page;
          }
        }

        handleQuery();
      });
    });
  } else if (title === "clearing-rate") {
    dialog.visible = false;

    ElMessageBox.confirm("确定要将所有码商费率清0吗？", "将所有码商费率清0", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    }).then(() => {
      // 访问接口；刷新列表
    });
  } else if (title === "zengjianyue") {
    // 增减余额
    dialog.visible = true;
    dialog.title = "增减余额";
    dialog.leftBtnText = "确 定";
    dialog.rightBtnText = "取 消";
    initDialogForm.value.initKeys = [
      {
        // 类型
        type: "input",
        // 唯一标识
        key: "mer_name",
        // 表单属性
        formAttrs: {
          label: "商户名字",
        },
        // 控制属性
        controlAttrs: {
          // 提示文本
          // 是否可清空
          clearable: true,
          filterable: true,
          disabled: true,
        },
        value: dialog.singleData.mer_name,
        // 控制事件
        controlOn: {},
      },
      {
        // 类型
        type: "input",
        // 唯一标识
        key: "usable_amount",
        // 表单属性
        formAttrs: {
          label: "余额",
        },
        // 控制属性
        controlAttrs: {
          // 提示文本
          // 是否可清空
          clearable: true,
          filterable: true,
          disabled: true,
        },
        value: dialog.singleData.usable_amount,
        // 控制事件
        controlOn: {},
      },
      {
        // 类型
        type: "select",
        // 唯一标识
        key: "handle_type",
        // 表单属性
        formAttrs: {
          label: "操作类型",
        },
        // 控制属性
        controlAttrs: {
          // 提示文本
          placeholder: "请输入操作类型",
          // 是否可清空
          clearable: true,
          filterable: true,
        },
        // 控制事件
        controlOn: {},
      },
      // {
      //   // 类型
      //   type: "select",
      //   // 唯一标识
      //   key: "capital_type",
      //   // 表单属性
      //   formAttrs: {
      //     label: "资金类型",
      //   },
      //   // 控制属性
      //   controlAttrs: {
      //     // 提示文本
      //     placeholder: "请输入资金类型",
      //     // 是否可清空
      //     clearable: true,
      //     filterable: true,
      //   },
      //   // 控制事件
      //   controlOn: {},
      // },
      {
        // 类型
        type: "select",
        // 唯一标识
        key: "reason",
        // 表单属性
        formAttrs: {
          label: "原因",
        },
        // 控制属性
        controlAttrs: {
          // 提示文本
          placeholder: "请输入原因",
          // 是否可清空
          clearable: true,
          filterable: true,
        },
        // 控制事件
        controlOn: {},
      },
      {
        // 类型
        type: "input-number",
        // 唯一标识
        key: "amount",
        // 表单属性
        formAttrs: {
          label: "金额",
        },
        // 控制属性
        controlAttrs: {
          // 提示文本
          placeholder: "请输入金额",
          // 是否可清空
          clearable: true,
          filterable: true,
        },
        // 控制事件
        controlOn: {},
      },
      {
        // 类型
        type: "input",
        // 唯一标识
        key: "remark",
        // 表单属性
        formAttrs: {
          label: "备注",
        },
        // 控制属性
        controlAttrs: {
          // 提示文本
          placeholder: "请输入备注",
          // 是否可清空
          clearable: true,
          filterable: true,
          type: "textarea",
        },
        // 控制事件
        controlOn: {},
      },
    ];

    Object.keys(options).map((key) => {
      const item = initDialogForm.value.initKeys;
      const i = item.findIndex((item) => item.key === key);

      if (i > -1) {
        initDialogForm.value.initKeys[i].options = options[key];
      }
    });
  } else if (title === "clear-login") {
    dialog.visible = false;
    ElMessageBox.confirm("确定要清除登录失败信息吗？", "清除登录失败信息", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    }).then(() => {
      // 访问接口；刷新列表
      login_clear({ ms_id: row.id }).then(() => {
        ElMessage.success("清除登录失败信息成功");

        handleQuery();
      });
    });
  } else if (title === "clear-google") {
    dialog.visible = false;
    ElMessageBox.confirm("确定要清除Google验证吗？", "清除Google验证", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    }).then(() => {
      // 访问接口；刷新列表
      google_clear({ ms_id: row.id }).then(() => {
        ElMessage.success("清除Google验证成功");

        handleQuery();
      });
    });
  } else if (title === "tg") {
    // tg
    dialog.visible = true;
    dialog.title = "TG";
    dialog.width = 400;
    dialog.leftBtnText = "绑 定";
    dialog.rightBtnText = "解 绑";

    initDialogForm.value.rowAttrs.columnsNum = 1;

    initDialogForm.value.initKeys.push(
      ...[
        {
          // 类型
          type: "input",
          // 唯一标识
          key: "tg_str",
          // 表单属性
          formAttrs: {
            label: "TG用户名",
          },
          // 控制属性
          controlAttrs: {
            // 提示文本
            placeholder: "请输入TG用户名",
            // 是否可清空
            clearable: true,
          },
          // 控制事件
          controlOn: {},
          value: dialog.singleData.tg_str,
        },
      ]
    );
  } else if (title === "remove-tg-all") {
    ElMessageBox.confirm("确定解绑所有商户TG？", "一键解绑", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    }).then(() => {
      // 访问接口；刷新列表
      tg_clear_all().then(() => {
        ElMessage.success("解绑所有商户TG成功");

        handleQuery();
      });
    });
  }
}

// 弹窗对象
const dialog = reactive({
  visible: false,
  type: "user-form",
  width: 800,
  title: "",
  leftBtnText: "确 定",
  rightBtnText: "取 消",
});
const dialogBak = { ...dialog };
const dialogForPayOnOff = reactive({
  visible: false,
  type: "user-form",
  width: 1200,
  title: "",
  // leftBtnText: "确 定",
  rightBtnText: "取 消",
  singleData: {},
  closeDialog() {
    dialogForPayOnOff.visible = false;
  },
  handleLeftClick() {},
  handleRightClick() {
    dialogForPayOnOff.closeDialog();
  },
});

let formDialogId = ref<FormInstance>();

/**
 * 关闭弹窗
 *
 * @param type 弹窗类型  用户表单：user-form | 用户导入：user-import
 */
function closeDialog() {
  dialog.visible = false;
}
function closedDialog() {
  // formDialogId.value?.resetFields();
  // formDialogId.value?.clearValidate();
  formDialogId.value = {};
  formDialogModel.value = {};
  initDialogForm.value.initKeys.splice(0);
  Object.keys(dialogBak).map((key) => {
    dialog[key] = dialogBak[key];
  });

  initDialogForm.value = cloneDeep(initDialogFormBak);
}

let formDialogModel = ref({});
function handleLeftClick() {
  if (dialog.type === "add") {
    formDialogId.value.validate((valid, fields) => {
      if (valid) {
        let params = { ...formDialogModel.value, mer_type: route.meta.mer_type };

        // params.pass_show = params.pass_show ? 1 : 2;
        // params.order_float_amount = params.order_float_amount ? 1 : 2;
        // params.pay_page_sub_name = params.pay_page_sub_name ? 1 : 2;
        // params.int_skm_amount = params.int_skm_amount ? 1 : 2;
        // params.skm_amount_range = params.skm_amount_range ? 1 : 2;
        // params.handle_order_status = params.handle_order_status ? 1 : 2;
        // params.status = params.status ? 1 : 2;

        add(params).then((res) => {
          ElMessage.success("添加商户成功");
          closeDialog();
          handleQuery();
        });
      }
    });
  } else if (dialog.type === "agency-rate") {
    formDialogId.value.validate((valid, fields) => {
      if (valid) {
        // let params = { ...dialog.singleData, ...formDialogModel.value };
        let params = { ...formDialogModel.value, id: dialog.singleData.id };

        edit(params).then((res) => {
          ElMessage.success("代付费率修改成功");
          closeDialog();
          handleQuery();
        });
      }
    });
  } else if (dialog.type === "edit") {
    formDialogId.value.validate((valid, fields) => {
      if (valid) {
        let params = { ...formDialogModel.value, id: dialog.singleData.id };

        switchFieldArr.map((field) => {
          params[field] = switchFieldHandle.getField(params[field]);
        });

        edit(params).then((res) => {
          ElMessage.success("修改用户资料成功");
          closeDialog();
          handleQuery();
        });
      }
    });
  } else if (dialog.type === "zengjianyue" || dialog.type === "zengjiandongjiejine") {
    formDialogId.value.validate((valid, fields) => {
      if (valid) {
        let params = {
          ...formDialogModel.value,
          mer_id: dialog.singleData.id,
          capital_type: dialog.type === "zengjianyue" ? 1 : 2,
        };

        amount_change(params).then((res) => {
          ElMessage.success("余额修改成功");
          closeDialog();
          handleQuery();
        });
      }
    });
  } else if (dialog.type === "tg") {
    formDialogId.value.validate((valid, fields) => {
      if (valid) {
        let params = {
          ...formDialogModel.value,
          mer_id: dialog.singleData.id,
        };

        tg_bind(params).then((res) => {
          ElMessage.success("绑定tg成功");
          closeDialog();
          handleQuery();
        });
      }
    });
  }
}

function handleRightClick() {
  // formDialogId.
  if (dialog.type === "tg") {
    formDialogId.value.validate((valid, fields) => {
      if (valid) {
        let params = {
          mer_id: dialog.singleData.id,
        };

        tg_clear(params).then((res) => {
          ElMessage.success("解绑tg成功");
          closeDialog();
          handleQuery();
        });
      }
    });
  } else {
    closeDialog();
  }
}

function handleChangeStatus(val, obj, index, fieldName) {
  // tableDatasObj.value.list[index][fieldName] = switchFieldHandle.getField(!val);
  let params = { ...obj };
  params[fieldName] = switchFieldHandle.getField(val);
  edit(params)
    .then((res) => {
      ElMessage.success("修改成功");
      handleQuery();
    })
    .catch(() => {
      tableDatasObj.value.list[index][fieldName] = switchFieldHandle.getField(val);
      nextTick(() => {
        tableDatasObj.value.list[index][fieldName] = switchFieldHandle.getField(!val);
      });
    });
}

onMounted(() => {
  tableDatasObj.value.queryParams = { ...searchForm.value };

  handleQuery(tableDatasObj.value.paging);
});
</script>

<style scoped></style>
